<template>
	<view class="msg_box">
		<div class="animate__animated animate__shakeX" v-for="(val,index) in msgList" :key="index">{{val}}</div>
	</view>
</template>

<script>
	export default{
		name:"MsgTip",
		data() {
			return {
				msgList:[]
			}
		},
		methods:{
			showMsg(msg){
				if(msg){
					this.msgList.push(msg)
					setTimeout(()=>{
						this.hideMsg(msg)
					},2000)
				}
			},
			hideMsg(msg){
				const index = this.msgList.indexOf(msg)
				console.log(index);
				this.msgList.splice(index,1)
			}
		}
	}
</script>

<style lang="scss">
	@import url('animate.css');
</style>